<template>
  <div class="leader_box">
    <div class="left">
      <div></div>
      <BlockBox title="事件类型" subtitle="" class="box box1"  :showMore="false" :isListBtns="false" :blockHeight="284">
      </BlockBox>
      <BlockBox title="事件趋势" subtitle="Introduction to Hushu" class="box box2"  :showMore3="true" :isListBtns="false" :blockHeight="284" @handleShowMore="handleClick">
      </BlockBox>
      <BlockBox title="事件趋势" subtitle="Introduction to Hushu" class="box box2"  :showMore3="true" :isListBtns="false" :blockHeight="284" @handleShowMore="handleClick">
      </BlockBox>
    </div>
    <div class="right"></div>


    <pop1 v-model="popShow"/>
  </div>
</template>
<script>
import BlockBox from '@/components/common/blockBox/index1.vue'
import pop1 from '@/components/common/pop/pop1.vue'
export default {
  name: "",
  components: {
    BlockBox,
    pop1
  },
  data() {
    return {
      popShow:false,
    }
  },
  mounted() {

  },
  methods: {
    handleClick(){
      debugger
      console.log("2")
      this.popShow=true;
    }
  }
}
</script>
<style scoped lang="scss">
.leader_box {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  display: flex;
  justify-content: space-between;

  .left {
    width: 450px;
    margin-top: 87px;
    margin-left: 32px;
    position: relative;
    z-index: 1003;
  }

  .right {
    width: 450px;
    display: flex;
    justify-content: space-between;
    margin-top: 87px;
    margin-right: 32px;
    position: relative;
    z-index: 1003;
  }
}

</style>